<template>
    <ContentLayout>
      <el-row>主要按钮</el-row>
      <el-row>
        <EvButton type="primary" icon="el-icon-plus">默认</EvButton>
        <EvButton type="primary" icon="el-icon-plus" disabled>禁用</EvButton>
      </el-row>
      <el-row>次要按钮</el-row>
      <el-row>
        <EvButton type="primary" plain icon="el-icon-plus">默认</EvButton>
        <EvButton type="primary" plain icon="el-icon-plus" disabled>禁用</EvButton>
      </el-row>
      <el-row>危险按钮</el-row>
      <el-row>
        <EvButton type="info" icon="el-icon-delete">默认</EvButton>
        <EvButton type="info" icon="el-icon-delete" disabled>禁用</EvButton>
      </el-row>

      <el-row class="top">圆角按钮</el-row>
      <el-row>
        <EvButton round>默认按钮</EvButton>
        <EvButton type="primary" round>主要按钮</EvButton>
        <EvButton type="info" round>信息按钮</EvButton>
      </el-row>
      <el-row class="top">图标按钮</el-row>
      <el-row>
        <EvButton icon="el-icon-search" circle></EvButton>
        <EvButton type="primary" icon="el-icon-edit" title="编辑" circle></EvButton>
        <EvButton type="info" icon="el-icon-message" title="消息" circle/>
        <EvButton type="primary" icon="el-icon-delete" title="删除"></EvButton>
        <EvButton type="primary" icon="el-icon-search">搜索</EvButton>
        <EvButton type="primary"
          >上传<i class="el-icon-upload el-icon--right"></i
        ></EvButton>
      </el-row>
      <el-row class="top">文字按钮</el-row>
      <el-row>
        <EvButton type="text"
          >文字按钮文字按钮文字按钮文字按钮文字按钮文字按钮</EvButton
        >
        <EvButton type="text" disabled>文字按钮</EvButton>
      </el-row>
      <el-row class="top">不同尺寸</el-row>
      <el-row>
        <EvButton>默认按钮</EvButton>
        <EvButton size="medium">中等按钮</EvButton>
        <EvButton size="small">小型按钮</EvButton>
        <EvButton size="mini">超小按钮</EvButton>
      </el-row>
      <el-row>
        <EvButton round>默认按钮</EvButton>
        <EvButton size="medium" round>中等按钮</EvButton>
        <EvButton size="small" round>小型按钮</EvButton>
        <EvButton size="mini" round>超小按钮</EvButton>
      </el-row>
    </ContentLayout>
  </template>
  
  <script>
  import ContentLayout from "@/layout/contentLayout.vue";

  export default {
    name: "buttonPage",
    components: { ContentLayout },
    data() {
      return {};
    },
    mounted() {},
  };
  </script>
  
  <style lang="scss" scoped>
  .top {
    margin-top: 20px;
    margin-bottom: 8px;
  }
  </style>
  